

import React from 'react';
import {Row,Col,Table,Button,Spin,Card} from 'antd';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import {Link} from 'react-router-dom';
import LeftMenuItem from 'component/leftmenuitem/index.jsx';

import MMUtile from 'util/mm.jsx';
import User from 'service/user-service.jsx';
import Safty from 'service/safty-service.jsx';
const _mm = new MMUtile();
const _user = new User();
const _safty = new Safty();

const { Column } = Table;

class RecordSafty extends  React.Component{
	constructor(props){
		super(props);
		this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
		this.state={

			items:[{'name':'修改密码','actived':false,'link':'/updatepsw','icon':'edit'},
			{'name':'密保设置','actived':false,'link':'/security','icon':'key'},
			{'name':'绑定手机','actived':false,'link':'/updatephone','icon':'mobile'},
			{'name':'登录邮箱','actived':false,'link':'/updateemail','icon':'mail'},
			{'name':'登录记录','actived':true,'link':'','icon':'profile'}],
			columns :[{
			  title: '时间',
			  dataIndex: 'loginDate',
			  key: 'loginDate',
			}, {
			  title: 'Ip',
			  dataIndex: 'ip',
			  key: 'ip',
			}, {
			  title: '城市',
			  dataIndex: 'loginAddress',
			  key: 'loginAddress',
			}],
			dataSource:[],
			loading:true

		}
	}
	componentDidMount(){
		//获取密保
		_safty.getLoginRecord().then((res)=>{
			if(res){
				this.setState({
					dataSource:res
				})
			}

			this.setState({
				loading:false
			})
		},(errMsg)=>{
				this.setState({
					loading:false
				})
			_mm.errorTips(errMsg)
		})
	}
	render(){
		return (
			<div>
				<Row gutter={24}>
					<Col span={7}>
		        <Card bordered={true} className="itemminheight"><LeftMenuItem items={this.state.items}></LeftMenuItem></Card>
		      </Col>
		      <Col span={17}>
						<Spin spinning={this.state.loading}   size="large">
							<Row>
								<Col span={24}>以下列表是您的登录记录</Col>
								<Col span={24}>如果感觉有异常，请及时<Link to="/updatepsw"><Button type="primary">修改密码</Button></Link></Col>
								<Col span={24}>
									<Table dataSource={this.state.dataSource} columns={this.state.columns} ></Table>
								</Col>
							</Row>
						</Spin>
					</Col>
				</Row>
			</div>
		)
	}
}

export default RecordSafty